<!DOCTYPE html>
<html>
  <head>
    {include file="common/meta" /}
    <style>
      .IndexSite {
        width: 100%;
      }
    </style>
  </head>

  <body>
    <main class="content">
      <!--顶部导航-->
      <div class="IndexHeader">
        <div class="IndexSite">{$ip_city.name}</div>
        <div class="IndexTitle">附近</div>
        <div class="IndexSearch">
          <a href="{:url('shop/search')}"
            ><img src="/map/images/search.png" alt="搜索"
          /></a>
        </div>
      </div>
      <div class="CommonMain"  class="BalanceDetail"
           style="position: fixed;width:100%;height:99%;overflow-y:auto;-webkit-overflow-scrolling: touch;">
        <div class="CollectList"></div>
      </div>
    </main>
    {include file="common/foot" /} {include file="common/script" /}
  </body>
</html>

<script type="text/javascript" src="__CDN__/assets/js/zepto.min.js"></script>

<script
  type="text/javascript"
  src="__CDN__/assets/js/PullToRefresh.min.js"
></script>
<script>
  var n = 1,
    flag = true;

  var refreshBox = new PullToRefresh({
    container: ".CommonMain",
      pull: {
          callback: function() {
              setTimeout(function() {
                  n++;
                  re_ajax(n);
                  refreshBox.endPullRefresh(true);
              }, 1000);
          }
      },
    up: {
      callback: function() {
        setTimeout(function() {
          n++;
          re_ajax(n);
          refreshBox.endUpLoading(flag);
        }, 1000);
      }
    }
  });
  re_ajax(1);
  function re_ajax(page) {
    $.ajax({
      type: "GET",
      url: "{:url('shop/shoplist_ajax')}",
      dataType: "json",
      data: {
        page: page,
        keysword: "{:input('keysword')}"
      },
      success: function(html) {
          console.info(html);
        if (html == "0") {
          $(".loadingBox").html("没有更多数据了");
            flag = false;
            refreshBox.endPullRefresh(false);
        } else {
          $(".CollectList").append(html);
        }
      },
      error: function(jqXHR) {
          flag = false;
      }
    });
  }
</script>
